<template>
  <div id="app">
    <header class="head">
      <router-link class="back tl" to='/index'>
        <i class="el-icon-arrow-left"></i>
      </router-link>
      <a href="javascript:;" class="tc">
        <small class="font_18 co_f">档案信息</small>
      </a>
      <a href="javascript:;" class="tr">
        <small class="font_18 co_f"></small>
      </a>
    </header>
    <main>
      <div class="floor-divider company-border-both ng-scope"></div>
      <section class="company-info ng-scope">
        <div class="company-logo">
          <img v-if="this.datalist.enterpriseForPermit.restaurantPicture==null" src="../../assets/img/school.png">
          <img v-else :src="'http://222.77.181.149:2210'+ this.datalist.enterpriseForPermit.restaurantPicture.fullPath">
        </div>
        <div class="company-intro">
          <div class="company-name">{{this.datalist.name}}</div>
          <div class="company-detail"> <span class="ng-binding">简介：{{this.datalist.enterpriseForPermit.describe}}</span></div>
          <div class="company-detail"> <span class="ng-binding">文化:{{this.datalist.enterpriseForPermit.trafficRoute}}</span></div>
          <!-- <div class="company-detail"> <span class="ng-binding">餐厅商圈:</span></div>
                  <div class="company-detail"> <span class="ng-binding">预定电话:</span></div>
                  <div class="company-detail"> <span class="ng-binding">餐厅菜系:</span></div>
                  <div class="company-detail"> <span class="ng-binding">人均消费:</span></div>
                  <div class="company-detail"> <span class="ng-binding">商家网址:</span></div> -->
          <!-- <a href="/preview.html">样本预览</a> --></div>
      </section>
      <div class="floor-divider company-border-both ng-scope"></div>
      <section>
        <div class="company-info-details">
          <p><label>许可证</label><span>
             <img v-if="this.datalist.enterpriseForPermit.licensePictureFile==null" src="../../assets/img/school.png">
             <img v-else :src="'http://222.77.181.149:2210'+ this.datalist.enterpriseForPermit.licensePictureFile.fullPath">
            </span></p>
          <p><label>餐厅商圈</label><span>{{this.datalist.enterpriseForPermit.businessCircle.name}}</span></p>
          <p><label>预定电话</label><span>{{this.datalist.enterpriseForPermit.phone}}</span></p>
          <p><label>餐厅菜系</label><span>{{this.datalist.enterpriseForPermit.cuisineSeries}}</span></p>
          <p><label>人均消费</label><span>{{this.datalist.enterpriseForPermit.perCapitaConsumption}}元 至 {{this.datalist.enterpriseForPermit.perCapitaConsumption2}}元</span></p>
          <p><label>商家网址</label><span>{{this.datalist.enterpriseForPermit.webSite}}</span></p>
        </div>
      </section>
    </main>
  </div>
</template>

<script>
  import {
    PermitInfoForEnterpriseUnid
  } from '../../api/api';
  export default {
    data() {
      return {
        datalist: {}
      };
    },
    methods: {
      getdata: function() {
        let options = {
          params: {
            enterpriseUnid: JSON.parse(localStorage.getItem('auth')).enterpriseUnid,
          }
        };
        PermitInfoForEnterpriseUnid(options).then((res) => {
          if (res.success === true) {
            this.datalist = res.data;
          }
        })
      },
    },
    created() {
      this.getdata()
    }
  }
</script>

<style lang="scss" scoped>
  .mint-header {
    background: #43464f;
  }
  
  .floor-divider {
    height: 12px;
    background: #f5f5f5;
  }
  
  .company-border-both {
    border-top: 1px solid #d9e0e2;
    border-bottom: 1px solid #d9e0e2;
  }
  
  
  /**/
  
  .company-info {
    overflow: hidden;
    clear: both;
    color: #666;
    padding: 12px 0 10px 15px;
  }
  
  .company-logo {
    float: left;
    width: 40px;
    height: 40px;
    display: flex;
    border: 1px solid #d9e0e2;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .company-intro {
    margin-left: 55px;
    overflow: hidden;
  }
  
  .company-detail {
    padding: 5px 0px;
  }
  
  .company-name {
    color: #333;
    font-size: 1rem;
    display: inline-block;
    font-weight: bold;
    margin-bottom: 5px;
  }
  
  .company-detail span {
    color: #9a9a9a;
  }
  .company-info-details p:last-child{
    border-bottom: none
  }
  .company-info-details {
    border-bottom: 1px solid #d9e0e2;
    p {
    label {
      font-size: .9rem;
    }
    span{
      color: #666;
    }
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content:space-between;
    align-items: center;
    padding: 12px 0px;
    margin: 0px 10px;
    border-bottom: 1px solid #d9e0e2;
    img {
      width: 2.8rem;
      height: 2.8rem;
    }
  }}
</style>
